<template>
	<view class="content">
		<view class="title">
			{{classItem.course.name}}
		</view>
		<view class="infos">
			<view class="item">
				课程类型：{{classItem.course.category}}
			</view>
			<view class="item">
				课程教师：{{classItem.teacher}}
			</view>
			<view class="item">
				上课地址：{{classItem.address}}
			</view>
			<view class="item">
				上课时间：{{classItem.time}}
			</view>
		</view>
		<view class="buttons">
			<view class="button">
				<u-button text="查看班级" type="primary" @click="toStudents"></u-button>
			</view>
			<view class="button">
				<u-button text="结课" type="error" v-if="!classItem.complete" @click="end"></u-button>
			</view>

		</view>
	</view>
</template>

<script>
	import api from '@/api/index.js'; // 引入api

	export default {
		data() {
			return {
				id: -1,
				classItem: {
					address: "二教四楼419",
					complete: true,
					course: {
						assessment: "考试",
						category: "专业必修/基础课",
						credit: 2,
						experimental_hours: 0,
						id: 45,
						lecture_hours: 32,
						name: "计算机专业英语",
						other_hours: 0,
						practical_hours: 0,
						total_hours: 32,
						weekly_hours: 2,
					},
					course_id: 45,
					end_time: "2022-04-30T00:00:00",
					id: 4,
					max_num: 30,
					num: 0,
					start_time: "2022-04-10T00:00:00",
					teacher: "董一凡",
					teacher_id: 2,
					time: "星期五 3-4节",

				}
			};
		},
		methods: {
			toStudents() {
				uni.navigateTo({
					url: `students?id=${this.id}&complete=${this.classItem.complete}`
				})
			},
			end() {
				console.log(this.classItem.id)
				let token = uni.getStorageSync("token")
				let data = {
					id: this.classItem.id
				}
				uni.request({
					url: `http://127.0.0.1:8000/end/`,
					data: data,
					method: "POST",
					header: {
						'Authorization': 'JWT ' + token // 参数
					},
					success: (res) => {
						if (res.data.code == 1) {
							this.classItem.complete = true
						} else {
							uni.showModal({
								content: res.data.errors,
								showCancel: false
							})
						}
					},
					fail: (err) => {
						console.log(err)
					}
				})
			}
		},
		onLoad(options) {
			let id = options['id']
			this.id = id
			let token = uni.getStorageSync('token')
			api.getTeacherClassByID(token, id).then((res) => {
				if (res.code === 1) {
					this.classItem = res.data
					console.log(this.classItem)
				} else if (res.code === 0) {
					uni.showModal({
						content: res.data.errors
					})
				}

			}).catch(() => {
				uni.showModal({
					content: "异常",
					showCancel: false,
					success() {
						uni.navigateBack({

						})
					}
				})
			})
		}
	}
</script>

<style lang="scss">
	.content {
		width: 750rpx;
		display: flex;
		align-items: center;
		flex-direction: column;

		.title {
			width: 100%;
			text-align: center;
			height: 80px;
			line-height: 80px;
			font-size: 40rpx;
			background-color: #a62618;
			color: white;
		}

		.infos {
			width: 100%;

			.item {
				height: 70px;
				line-height: 70px;
				margin: 15px 10px;
				background-color: #E1E1E1;
				padding: 0 20px;
				font-size: 33rpx;
				// color: white;
			}
		}

		.buttons {
			width: 100%;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
			flex-wrap: wrap;

			.button {
				width: 325rpx;
				height: 60px;
				padding: 5px 25rpx;
				// background-color: #0077AA;
			}
		}

	}
</style>
